<!--
 * @Author: chunlai
 * @Date: 2025-07-15 09:00:21
 * @LastEditTime: 2025-09-11 09:06:29
 * @LastEditors: minsheng_insurance_agency_zhoucl
 * @FilePath: \02.bldinsure\src\views\index\feecount\AppntFactors.vue
 * @Description: 投保人试算因子
-->
<template>
  <div>
    <van-field
      label="姓名"
      :input-align="inputAlign"
      class="refname"
      v-model="userInfo.name"
      clearable
      placeholder="请输入"
      @focus="tipsInfo.name = ''"
      :error="tipsInfo.name !== ''"
      :error-message="tipsInfo.name"
      v-if="formApiReg.hasOwnProperty('name')"
    >
    </van-field>
    <div key="tbrmode2" v-show="enfold">
      <van-field
        label="证件类型"
        :input-align="inputAlign"
        class="refidType"
        @click="showPopAction('picker', 'idType', idTypeList, userInfo.idType)"
        @focus="tipsInfo.idType = ''"
        :value="userInfo.idName"
        readonly
        placeholder="请选择"
        :error="tipsInfo.idType !== ''"
        :error-message="tipsInfo.idType"
        v-if="formApiReg.hasOwnProperty('idType')"
      >
        <span
          class="ms-row-icon"
          slot="right-icon"
          v-if="idTypeList.length > 1"
        ></span>
      </van-field>
      <van-field
        class="refidNum"
        label="证件号码"
        :input-align="inputAlign"
        v-model="userInfo.idNum"
        clearable
        placeholder="请输入"
        @click="tipsInfo.idNum = ''"
        @focus="foI = true"
        @blur="
          foI = false;
          changeIdNum();
        "
        :error="tipsInfo.idNum !== ''"
        :error-message="tipsInfo.idNum"
      >
      </van-field>
      <van-field label="性别" :input-align="inputAlign" class="refsex">
        <div slot="input">
          <span class="btn_text thin-border" v-if="disabled2Sex">
            {{ userInfo.sex == "1" ? "女" : "男" }}
          </span>
          <MsRadios
            v-else
            :curVal="userInfo.sex"
            :arrList="sexList"
            type="sex"
            @change="changeMsRadio"
          />
        </div>
      </van-field>
      <van-field
        label="出生日期"
        placeholder="请选择"
        :input-align="inputAlign"
        class="refbirthDate"
        @click-input="showPopAction('date', 'birthDate', [])"
        :error="tipsInfo.birthDate !== ''"
        :error-message="tipsInfo.birthDate"
        readonly
      >
        <div class="age-box" slot="input">
          <span v-if="userInfo.birthDate"
            >{{ userInfo.birthDate }} ( {{ ageVal }}周岁 )
          </span>
          <span v-else style="color: #999">请选择</span>
        </div>
        <span class="ms-row-icon" slot="right-icon" v-if="!disabled2Sex"></span>
      </van-field>
      <van-field
        label="职业名称"
        :input-align="inputAlign"
        class="refoccupationCode"
        :value="userInfo.occupationCodeName"
        @click="
          showPopAction('job', 'occupationCode', []);
          tipsInfo.occupationCode = '';
        "
        type="textarea"
        rows="1"
        autosize
        readonly
        placeholder="请选择"
        :error="tipsInfo.occupationCode !== ''"
        :error-message="tipsInfo.occupationCode"
        v-if="formApiReg.hasOwnProperty('occupationCode')"
      >
        <span class="ms-row-icon" slot="right-icon"></span>
      </van-field>
      <van-field
        label="是否有社保"
        :input-align="inputAlign"
        class="refsocialInsuFlag"
        readonly
        @focus="tipsInfo.socialInsuFlag = ''"
        :error="tipsInfo.socialInsuFlag !== ''"
        :error-message="tipsInfo.socialInsuFlag"
        v-if="formApiReg.hasOwnProperty('socialInsuFlag')"
      >
        <template #input>
          <MsRadios
            :curVal="userInfo.socialInsuFlag"
            :arrList="socialSecList"
            type="socialInsuFlag"
            @change="changeMsRadio"
          />
        </template>
      </van-field>
    </div>
    <!-- 下拉选择 -->
    <van-popup v-model="showPop" round position="bottom">
      <van-picker
        v-if="popConfig.type == 'picker'"
        ref="picker"
        show-toolbar
        :columns="viewOptions"
        @confirm="onConfirmPick"
        @cancel="showPop = false"
        :default-index="defaultIndex"
      >
        <div slot="title" class="keyBox" v-if="popConfig.list.length > 8">
          <input
            type="text"
            class="keyInput"
            placeholder="请输入关键字查询"
            v-model="keyWord"
          />
        </div>
      </van-picker>
      <van-datetime-picker
        v-else-if="popConfig.type == 'date'"
        :value="currentDate"
        :min-date="minDate"
        :max-date="maxDate"
        type="date"
        @confirm="confirmBirthDate"
        @cancel="showPop = false"
      />
      <OccupationPop
        v-else-if="popConfig.type == 'job'"
        utype="tbr"
        @cancel="showPop = false"
        @confirm="confirmJob"
      />
    </van-popup>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { validateSimpleInfo } from "./validate";
import { feeCountMixin } from "./count";
import { popupMixin } from "@/mixins/popup";
export default {
  name: "AppntFactors",
  props: ["enfold"],
  components: {},
  data() {
    return {
      userType: "投保人",
      userFlag: "tbr0",
      userInfo: {},
    };
  },
  computed: {
    ...mapGetters({
      formApiReg: "infoReg/tbrApiReg",
      idTypeList: "dictionary/applicantIdTypeList",
      tbBirthStrMin: "infoReg/tbBirthMin",
      tbBirthStrMax: "infoReg/tbBirthMax",
    }),
  },
  watch: {
    userInfo: {
      handler: function (val) {
        if (this.pageLoad) {
          this.$store.commit("insert/UPDATE_APPLICANT", val);
        }
      },
      deep: true,
    },
  },
  mixins: [popupMixin, feeCountMixin],
  created() {
    const tbtItem = this.applicant;
    Object.keys(this.userInfo).map((key) => {
      if (tbtItem.hasOwnProperty(key)) {
        this.userInfo[key] = tbtItem[key];
      }
    });
    this.initPreDefData();
    this.$nextTick(() => {
      this.pageLoad = true;
    });
  },
  mounted() {},
  methods: {
    async saveForm() {
      // 根据证件号查询是否已存在承保保单并验证姓名
      let applicant = this.userInfo;
      // console.log('saveForm---1', this.userInfo);
      this.$store.commit("insert/UPDATE_APPLICANT", applicant);
      const iptCfg = JSON.parse(JSON.stringify(this.formApiReg));
      let res = await validateSimpleInfo(iptCfg, applicant, "投保人");
      if (res.status == false) {
        if (res.target) {
          this.tipsInfo[res.target] = res.msg;
          this.$store.commit("common/SET_FIELD_MEAN_CONT", {
            label: `规则校验`,
            desc: `投保人：${res.msg}`,
          });
        }
      }
      return res;
    },
  },
};
</script>
<style lang="less" scoped></style>
